<template>
  <el-card shadow="hover">
    <v-chart class="chart" :option="option" autoresize
  /></el-card>
</template>

<script lang="ts" setup>
import { ref, provide } from 'vue'

// provide(THEME_KEY, 'light')

const option = ref({
  title: {
    text: '登机人次',
    left: 'center',
  },

  xAxis: {
    type: 'category',
    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
  },
  yAxis: {
    type: 'value',
  },
  series: [
    {
      data: [120, 200, 150, 80, 70, 110, 130],
      type: 'bar',
      showBackground: true,
      backgroundStyle: {
        color: 'rgba(180, 180, 180, 0.2)',
      },
    },
  ],
})
</script>

<style scoped>
.chart {
  height: 400px;
}
</style>
